<!DOCTYPE html>
<html lang="en">


<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title><%= title %></title>
    <link rel="stylesheet" href="/bootstrap/dist/css/bootstrap.min.css" media="screen">
    <style type="text/css">
        .m15{ margin: 15px;}
        .tc{ text-align: center;font-size: 18px;font-weight: 600;}
    </style>
</head>
<body screen_capture_injected="true">
<div class="container">
    <form class="form-horizontal" role="form">
        <div class="form-group">
            <label class="col-sm-2 control-label">用户</label>
            <div class="col-sm-10">
                <p class="form-control-static" id = "name"><%= name %></p>
            </div>
        </div>
        <div class="form-group">
            <label for="inputPassword" class="col-sm-2 control-label">原密码</label>
            <div class="col-sm-10">
                <input type="password" class="form-control" id="inputPassword"
                       placeholder="请输入原密码">
            </div>
        </div>
        <div class="form-group">
            <label for="inputPassword01" class="col-sm-2 control-label">新密码</label>
            <div class="col-sm-10">
                <input type="password" class="form-control" id="inputPassword01"
                       placeholder="请输入新密码">
            </div>
        </div>
        <div class="form-group">
            <label for="inputPassword02" class="col-sm-2 control-label">确认密码</label>
            <div class="col-sm-10">
                <input type="password" class="form-control" id="inputPassword02"
                       placeholder="再次输入密码">
            </div>
        </div>
        <div class="form-group">
            <button type="button" class="btn btn-info col-sm-2 col-sm-offset-10" id="xiugai">确认</button>
        </div>
    </form>
</div>
<script type="text/javascript" src="/jquery/dist/jquery.min.js"></script>
<script type="text/javascript" src="/bootstrap/dist/js/bootstrap.min.js"></script>
<script type="text/javascript">
    $(function(){
        $("#xiugai").click(function(){
            var password = $("#inputPassword").val();
            var password01 = $("#inputPassword01").val();
            var password02 = $("#inputPassword02").val();
            var name = $("#name")[0].innerHTML;
            if(password01 !== password02){
                $("#inputPassword01").css("border","1px solid red");
                $("#inputPassword02").css("border","1px solid red");
            }else if(password01 === password02){
                var data = {"name":name,"password":password,"newPassword":password01};
                console.log(data);
                $.ajax({
                    url: '/userInfo',
                    type: 'post',
                    data: data,
                    success: function(data,status){
                        if(status == 'success'){
                            location.href = 'login';
                        }
                    },
                    error: function(data,err){
                        location.href = 'userInfo';
                    }
                });
            }
        });
    });
    setInterval(function() {
        var now = (new Date()).toLocaleString();
        $('#current-time').text(now);
    }, 1000);
</script>
</body>
</head>
</html>